<template>
  <div>
    <Drawer
      :closable="false"
      :mask-closable="true"
      :title="spokerInfo.name"
      @on-visible-change="
        (e) => {
          !e && $emit('closeDetailModal', false);
        }
      "
      :width="360"
      v-model="detailModal"
    >
      <Row class="ivu-mb-16 info" v-if="spokerInfo.card_no">
        <Col :span="8">账号类型:</Col>
        <Col :span="16">{{ spokerInfo.type == 1 ? "支付宝" : "银行卡" }}</Col>
        <Col :span="8">账号:</Col>
        <Col :span="16">{{ spokerInfo.card_no }}</Col>
        <Col :span="8" v-if="spokerInfo.type == 2">银行:</Col>
        <Col :span="16" v-if="spokerInfo.type == 2">{{
          spokerInfo.bank_name
        }}</Col>
      </Row>
      <div v-else class="ivu-text-center" style="margin-top: 100px">
        该用户未提交提现信息~
      </div>
    </Drawer>
  </div>
</template>
<script>
import { spokerAccount } from "@api/spokensman.js";
export default {
  props: ["detailModal", "spokerId"],
  data() {
    return {
      spokerInfo: {},
    };
  },
  watch: {
    detailModal() {
      if (this.detailModal) {
        spokerAccount({ id: this.spokerId }).then((res) => {
          this.spokerInfo = res;
        });
      }
    },
  },
};
</script>

<style lang="less" scoped>
.rate-demo {
  display: flex;
  align-items: center;
}
.info {
  line-height: 36px;
}
</style>
